<template>
	<view class="Confirmtotal">
		<view class="confirmtop">
			<view class="confirmName">
				<text style="color: #FFFFFF;">{{name}}</text>
			</view>
				
			<view class="confirmcontent">
					<view class="confirmcontent1">
							<h3>{{housetype}}</h3><span>房型餐食详情<u-icon name="arrow-right"></u-icon></span>
					</view>
					<view class="confirmcontent1">
							<p>入住时间：{{time}}</p>
					</view>
					<view class="confirmcontent1">
							{{housecontent}}
					</view>
					<view class="confirmcontent1" style="justify-content: flex-end;background-color: #f3f3f3;">
							<span>订房须知<u-icon name="arrow-right"></u-icon></span>
					</view>
					
			</view>
			
			<view class="personalinformation">
				<view class="xinxiTop">
					<view class="content1">	<text>房间数</text><p>{{hutCount}}</p></view>
				</view>
				<view class="xinxiTop">			
					<view class="content1">	<text style="display: flex;">住客姓名</text><p><input type="text" :value="hutName" placeholder="请输入姓名" /></p></view>
				</view>
				<view class="xinxiTop">		
					<view class="content1">	<text>大陆手机</text><p>+86 | {{hutTell}}</p></view>
									
				
					
				</view>
				<view class="xinxiMid">
					<view class="content2">
							<view class="xinxiTop">
							<view class="content1">	<text style="color: #000000;">本单可享</text><p style="color: #F0AD4E; font-size: 28rpx;">{{lowprice}}</p></view>
							</view>
							<view class="content1">	<text style="color: #000000;">优惠券</text><p>{{ticket}}</p></view>
					</view>
				</view>
				<view class="xinxiBtm">
					<view class="content3">
						<view class="xinxiTop">
						<view class="content1">	<text style="color: #000000;">特殊要求</text><p><input type="text" value=""placeholder="有无特殊需求" /></p></view>
						</view>
						<view class="content1">	<text style="color: #000000;">发票</text><p>{{bill}}</p></view>
					</view>
				</view>
				<view class="price">
					<view class="pricecontent">
						<text>总计:</text><span>{{sumprice}}</span>
					</view>
				
				</view>
				
				<view class="commit">
					
					<view>
					
						<u-button class="custom-style" type="warning" @click="pageTrsance()">立即下单</u-button>
					
					</view>
				</view>
				
							

						
				
			
			</view>
		
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				    name:'真心养老院',
					housetype:'豪华房',
					time:'2022-03-27至2022-05-27',
					housecontent:'大床2m|基本养老套餐',
					timeshow: false,
					value1: Number(new Date()),
					hutCount:'1间',
					hutName:'赵泰',
					hutTell:18423958168,
					lowprice:'已为你选择最佳优惠组合',
					ticket:'无可用优惠券',
					bill:'如需发票，可向前台索取',
					sumprice:'￥1550',
					commit_data:{}
			}
			
		},
		
		onLoad(option) {
			let data=JSON.parse(option.Data)
			console.log(data)
			let num=data.length-1
			this.time=data[0]+'~'+data[num]
			
			this.commit_data=data
		},
		methods: {
			pageTrsance(e){
				var date=JSON.stringify(e)
				this.$emit('commitData',)
				uni.switchTab({
					url: '../../pages/indent/indent'
				});
			},
		
		}
	}
</script>
 
<style lang="scss" scoped>
	.confirmtop{
		background-color: #f00408;
		height: 260rpx;
	}
	.confirmName{
		background-color: red;
		text-align: center;
		line-height: 80rpx;
		font-weight: 999;
	}
	
	.xinxiTop{
		
		background-color: #ffffff;
		border-bottom: 2rpx solid #dadada;
	}
	.xinxiMid{
		background-color: #ffffff;
		border-bottom: 2rpx solid #dadada;
		
	}
	.xinxiBtm{ 
		background-color: #ffffff;
		border-bottom: 2rpx solid #dadada;
	}
	.confirmcontent{
		width: 90%;
		margin: 0 auto;
		background-color: #ffffff;
		justify-content: space-between;
		border-radius: 20rpx;
		line-height: 40rpx;
		border: 4rpx solid #fbfaff;
	}
	.confirmcontent1{
		padding: 1% 5% 1% 5%,;
		display: flex;
		justify-content: space-between;
	}
	.confirmcontent1 span{
		display: flex;
	}
	
	.content1{
		
		
		color: #ececec;
		line-height: 50px;
		display: flex;
		width: 90%;
		margin:  0 auto;
		background-color: #ffffff;
	}
	.content1 text{
	
		font-size: 28rpx;
		background-color: #ffffff;
		width: 30%;
		color: #777777;
	}
	.content1 p{
		width: 70%;
		margin-left: 30px;
		color: #000000;
	}
	.content1 p input{
		margin-top: 6%;
	}
	.content2{
		margin-top: 10%;
		
	}
	.content3{
		margin-top: 10%;
		
	}		
	
	.price{
		color: #000000;
		line-height:50px;
		width: 100%;
		margin:  0 auto;
		background-color: #ffffff;
	
	}
	
	.pricecontent{
		display: flex;
		justify-content: flex-end;
		margin-top: 15%;
		padding-right: 5%;
	}
	.price span{
		
		color: #ff9800;
	}
	.commit{
		width: 100%;
		margin: 0 auto;
		position: fixed;
		bottom: 0;
	}
	
</style>
